<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>详情页</title>
		<link rel="stylesheet" type="text/css" href="/static/css/public.css"/>
		<link rel="stylesheet" type="text/css" href="/static/css/proList.css"/>
        <script src="/static/vue-2.5.16.js" type="text/javascript" charset="utf-8"></script>
        <script src="/static/axios-0.18.0.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="/static/host.js" type="text/javascript" charset="utf-8"></script>
        <script src="/static/common.js" type="text/javascript" charset="utf-8"></script>
        <script src="/static/js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>


	</head>
	<body>
    <div id="app" v-cloak>
		<!------------------------------head------------------------------>
		<div id="app" v-cloak class="head">
			<div class="wrapper clearfix">
				<div class="clearfix" id="top">
					<h1 class="fl"><a href="/index"><img src="/static/img/logo.png"/></a></h1>
					<div class="fr clearfix" id="top1">
						<p v-if="username" class="login_btn fl">
                             欢迎您：<em>[[ username ]]</em>
{#                                <span>|</span>#}
                                <a href="{{ url('users:logout') }}">退出</a>

						</p>
                        <p v-else class="login_btn fl">
                            <a href="{{ url('users:login') }}">登录</a>
							<a href="{{ url('users:register') }}" >注册</a>
                        </p>
						<form action="#" method="get" class="fl">
							<input type="text" placeholder="热门搜索：干花花瓶" />
							<input type="button" />
						</form>
						<div class="btn fl clearfix">
							<a href="{{ url('users:my_center') }}"><img src="/static/img/grzx.png"/></a>
							<a href="#" class="er1"><img src="/static/img/ewm.png"/></a>
							<a href="{{ url('users:my_cart') }}"><img src="/static/img/gwc.png"/></a>
							<p><a href="#"><img src="/static/img/smewm.png"/></a></p>
						</div>
					</div>
				</div>
				<ul class="clearfix" id="bott">
					<li><a href="/">首页</a></li>
					<li>
						<a href="#">所有商品</a>
						<div class="sList">
							<div class="wrapper  clearfix">
								<a href="/paint">
									<dl>
										<dt><img src="/static/img/nav1.jpg"/></dt>
										<dd>浓情欧式</dd>
									</dl>
								</a>
								<a href="/paint">
									<dl>
										<dt><img src="/static/img/nav2.jpg"/></dt>
										<dd>浪漫美式</dd>
									</dl>
								</a>
								<a href="/paint">
									<dl>
										<dt><img src="/static/img/nav3.jpg"/></dt>
										<dd>雅致中式</dd>
									</dl>
								</a>
								<a href="/paint">
									<dl>
										<dt><img src="/static/img/nav6.jpg"/></dt>
										<dd>简约现代</dd>
									</dl>
								</a>
								<a href="/paint">
									<dl>
										<dt><img src="/static/img/nav7.jpg"/></dt>
										<dd>创意装饰</dd>
									</dl>
								</a>
							</div>
						</div>
					</li>
					<li>
						<a href="/flowerDer">装饰摆件</a>
						<div class="sList2">
							<div class="clearfix">
								<a href="/proList">干花花艺</a>
								<a href="/vase_proList">花瓶花器</a>
							</div>
						</div>
					</li>
					<li>
						<a href="/decoration">布艺软饰</a>
						<div class="sList2">
							<div class="clearfix">
								<a href="{{ url('goods:zbproList') }}">桌布罩件</a>
								<a href="/bzproList">抱枕靠垫</a>
							</div>
						</div>
					</li>
					<li><a href="/paint">墙式壁挂</a></li>
					<li><a href="/perfume">蜡艺香薰</a></li>
					<li><a href="/idea">创意家居</a></li>
				</ul>
			</div>
		</div>
		<!-----------------address------------------------------->
		<div class="address" >
			<div class="wrapper clearfix">
				<a href="{{ url('index:index') }}">首页</a>
				<span>/</span>
				<a href="/flowerDer">装饰摆件</a>
				<span>/</span>
				<a href="/proList">干花花艺</a>
				<span>/</span>
				<a href="#" class="on">{{ sku.name }}</a>
			</div>
		</div>
		<!-----------------------Detail------------------------------>

		<div class="detCon">
			<div class="proDet wrapper">
				<div class="proCon clearfix">
					<div class="proImg fl">
						<img class="det" src="{{ sku.default_image }}" />

						<div class="smallImg clearfix">
                            {% for images in image %}
                            <img src="{{ images.little_image }}" data-src="{{ images.image }}">
{#							<img src="{{ images.image }}" data-src="http://img12.360buyimg.com/n1/jfs/t1/44033/2/12958/163306/5d638549E7ca67b47/8173a6097aa695f6.jpg">#}
{#							<img src="http://img14.360buyimg.com/n5/jfs/t1/81750/22/8264/165179/5d638572E6fcf4713/4485cf65c1a674cc.jpg" data-src="http://img14.360buyimg.com/n1/jfs/t1/81750/22/8264/165179/5d638572E6fcf4713/4485cf65c1a674cc.jpg">#}
{#							<img src="//img11.360buyimg.com/n5/jfs/t1/59657/26/8318/173128/5d638677E11ebb3ea/512ce99dca613b7d.jpg" data-src="//img11.360buyimg.com/n1/jfs/t1/59657/26/8318/173128/5d638677E11ebb3ea/512ce99dca613b7d.jpg">#}
						    {% endfor %}
                        </div>

					</div>
					<div class="fr intro">
						<div class="title">
							<h2>{{ sku.name }}</h2>
                            <br>
                            <br>
							<p>{{ sku.caption }}</p>
							<span>￥{{ sku.price }}</span>
						</div>
						<div class="proIntro">
							<p>颜色分类</p>
							<div class="smallImg clearfix categ">
                            {% for images in image %}
                             <p class="fl"><img src="{{ images.little_image }}" alt="{{ images.type_name }}" data-src="{{ images.image }}"></p>
                            {% endfor %}
{#								<p class="fl"><img src="http://img12.360buyimg.com/n5/jfs/t1/44033/2/12958/163306/5d638549E7ca67b47/8173a6097aa695f6.jpg" alt="大束双色满天星（黄+蓝）白色陶瓷花瓶" data-src="http://img12.360buyimg.com/n1/jfs/t1/44033/2/12958/163306/5d638549E7ca67b47/8173a6097aa695f6.jpg"></p>#}
{#								<p class="fl"><img src="http://img14.360buyimg.com/n5/jfs/t1/81750/22/8264/165179/5d638572E6fcf4713/4485cf65c1a674cc.jpg" alt="大束双色满天星（绿+黄）白色陶瓷花瓶"            data-src="http://img14.360buyimg.com/n1/jfs/t1/81750/22/8264/165179/5d638572E6fcf4713/4485cf65c1a674cc.jpg"></p>#}
{#								<p class="fl"><img src="//img11.360buyimg.com/n5/jfsf/t1/59657/26/8318/173128/5d638677E11ebb3ea/512ce99dca613b7d.jpg" alt="大束双色满天星（粉+白）白色陶瓷花瓶" data-src="//img11.360buyimg.com/n1/jfs/t1/59657/26/8318/173128/5d638677E11ebb3ea/512ce99dca613b7d.jpg"></p>#}

                            </div>
							<p>数量&nbsp;&nbsp;库存<span>{{ sku.stock }}</span>件</p>
							<div class="num clearfix">
								<img @click="on_minus" class="fl sub" src="/static/img/temp/sub.jpg">
								<span v-model="sku_count" @blur="check_sku_count" class="fl" contentEditable="true">1</span>
								<img  @click="on_addition" class="fl add" src="/static/img/temp/add.jpg">
{#								<p class="please fl">请选择商品属性!</p>#}
							</div>
						</div>
						<div class="btns clearfix">
{#							<a href="#2"><p class="buy fl">立即购买</p></a>#}
							<a @click='add_cart'><p class="cart fr" style="background: #C10000;color: #fff;">加入购物车</p></a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="introMsg wrapper clearfix">
			<div class="msgL fl">
				<div class="msgTit clearfix">
					<a class="on">商品详情</a>

					<a>所有评价</a>
				</div>

				<div class="msgAll">
					<div class="msgImgs">

                        {{ sku.spu.desc_detail|safe }}

					</div>

					<div class="eva">
                        {% for comm in comment %}
                        {% if comm %}
						<div class="per clearfix">
                        {% if not comm.image %}
							<img class="fl" src="/static/img/temp/per01.jpg">
                        {% else %}
                            <img class="fl" src="{{ comm.image }} " style="height: 100px;border-radius:60%; height: 100px; overflow:hidden;"/>
                        {% endif %}
							<div class="perR fl">
								<p>用户：{{ comm.username }}</p>
								<p>评论信息：{{ comm.comment }}</p>
								<p><span>商品：{</span><span>{{ sku.name }}</span></p>
							</div>
						</div>
                        {% else %}

                             <div>aaaaaaaaaaaaaaaaaaaaaaaa</div>


						</div>

                        {% endif %}
                        {% endfor %}
					</div>

				</div>

			</div>
			<div class="msgR fr">
				<h4>为你推荐</h4>
				<div class="seeList">
					<a href="#">
						<dl>
							<dt><img src="/static/img/temp/see01.jpg"></dt>
							<dd>【最家】复古文艺风玻璃花瓶</dd>
							<dd>￥193.20</dd>
						</dl>
					</a>
					<a href="#">
						<dl>
							<dt><img src="/static/img/temp/see02.jpg"></dt>
							<dd>【最家】复古文艺风玻璃花瓶</dd>
							<dd>￥193.20</dd>
						</dl>
					</a>
					<a href="#">
						<dl>
							<dt><img src="/static/img/temp/see03.jpg"></dt>
							<dd>【最家】复古文艺风玻璃花瓶</dd>
							<dd>￥193.20</dd>
						</dl>
					</a>
					<a href="#">
						<dl>
							<dt><img src="/static/img/temp/see04.jpg"></dt>
							<dd>【最家】复古文艺风玻璃花瓶</dd>
							<dd>￥193.20</dd>
						</dl>
					</a>
				</div>

			</div>
		</div>
		<div class="like">
			<h4>猜你喜欢</h4>
			<div class="bottom">
				<div class="hd">
					<span class="prev"><img src="/static/img/temp/prev.png"></span>
					<span class="next"><img src="/static/img/temp/next.png"></span>
				</div>
				<div class="imgCon bd">
					<div class="likeList clearfix">
						<div>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like01.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like02.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like03.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like04.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html" class="last">
								<dl>
									<dt><img src="/static/img/temp/like05.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
						</div>
						<div>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like01.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like02.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like03.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html">
								<dl>
									<dt><img src="/static/img/temp/like04.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
							<a href="proDetail.html" class="last">
								<dl>
									<dt><img src="/static/img/temp/like05.jpg"></dt>
									<dd>【最家】复古文艺风玻璃花瓶</dd>
									<dd>￥193.20</dd>
								</dl>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--返回顶部-->
		<div class="gotop">
			<a href="/carts">
			<dl class="goCart">
				<dt><img src="/static/img/gt1.png"/></dt>
				<dd>去购<br />物车</dd>
				<span>0</span>
			</dl>
			</a>
			<a href="#" class="dh">
			<dl>
				<dt><img src="/static/img/gt2.png"/></dt>
				<dd>联系<br />客服</dd>
			</dl>
			</a>
			<a href="my_center.html">
			<dl>
				<dt><img src="/static/img/gt3.png"/></dt>
				<dd>个人<br />中心</dd>
			</dl>
			</a>
			<a href="#" class="toptop" style="display: none;">
			<dl>
				<dt><img src="/static/img/gt4.png"/></dt>
				<dd>返回<br />顶部</dd>
			</dl>
			</a>
			<p>400-800-8200</p>
		</div>
		<div class="msk"></div>
		<!--footer-->
		<div class="footer">
			<div class="top">
				<div class="wrapper">
					<div class="clearfix">
						<a href="#2" class="fl"><img src="/static/img/foot1.png"/></a>
						<span class="fl">7天无理由退货</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="/static/img/foot2.png"/></a>
						<span class="fl">15天免费换货</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="/static/img/foot3.png"/></a>
						<span class="fl">满599包邮</span>
					</div>
					<div class="clearfix">
						<a href="#2" class="fl"><img src="/static/img/foot4.png"/></a>
						<span class="fl">手机特色服务</span>
					</div>
				</div>
			</div>
			<p class="dibu">最家家居&copy;2013-2017公司版权所有 京ICP备080100-44备0000111000号<br />
			违法和不良信息举报电话：188-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</p>
		</div>
        </div>
<script>
    var sku_price = "{{ sku.price }}";
    var category_id = "{{ sku.spu.category1.id }}";
    var sku_id = "{{ sku.id }}";
</script>
		<script src="/static/js/jquery.SuperSlide.2.1.1.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/js/public.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/js/nav.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/js/pro.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/js/cart.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/detail.js" type="text/javascript" charset="utf-8"></script>



		<script src="/static/base.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			jQuery(".bottom").slide({titCell:".hd ul",mainCell:".bd .likeList",autoPage:true,autoPlay:false,effect:"leftLoop",autoPlay:true,vis:1});
		</script>

	</body>
</html>
